<template>
  <div class="main-container-app">
    <el-row class="form-contain" >
      <fin-day-form @handleQueryFinDay="handleQueryFinDay"></fin-day-form >
    </el-row>
    <div class="table-contain">
    <fin-day-table :searchList="finDayRes" :listLoadingFinDay="loading"
                   @handleSizeChangeFinDay="handleSizeChangeFinDay"
                   @handleCurrentChangeFinDay="handleCurrentChangeFinDay"></fin-day-table>
    </div>
  </div>
</template>

<script>
  /* eslint-disable */
  import PaymentForm from "../operatingManagement/paymentChild/paymentForm";
  import FinDayTable from "./finDaySearchChild/finDayTable";
  import FinDayForm from "./finDaySearchChild/finDayForm";
  import {fetchListFinDay} from "../../api/trademag/finDay";

  export default {
    components: {
      FinDayForm,
      FinDayTable,
      PaymentForm},
    data() {
      return {
        finDayRes: null,
        loading: false,
        queryDataFinDay: '',
        listQuery: {
          page: 1,
          limit: 20
        }
      }
    },
    methods:{
      handleQueryFinDay(val){
        this.queryDataFinDay=val
        this.listQuery.page=1
        this.listQuery.limit=20
        this.getDataListFinDay()
      },
      handleCurrentChangeFinDay(val) {
        this.listQuery.page = val
        this.getDataListFinDay()
      },
      handleSizeChangeFinDay(val) {
        this.listQuery.limit = val
        this.listQuery.page = 1
        this.getDataListFinDay()
      },
      getDataListFinDay() {
        this.loading = true
        fetchListFinDay(this.listQuery, this.queryDataFinDay).then(res => {
          this.finDayRes = res
          this.loading = false
        },
          (err)=>{
            this.loading = false
          })
      }
    }
  }
</script>

<style scoped>
  /*.finDay {*/
    /*padding: 32px;*/
    /*background-color: rgb(240, 242, 245);*/
  /*}*/
</style>
